<template>
  <div class="index-wrap">
    <van-nav-bar
      title="线下活动"
      left-text="返回"
      left-arrow
      fixed
      @click-left="$router.go(-1)"
    />
    <div class="list-wrap p-t-xs p-b-xs">
      <div
        class="list-item m-l-s m-r-s bg-white p-s m-b-xs"
        v-for="item in 10"
        :key="item"
        @click="$router.push({ name: 'activitydetails', params: { id: item } })"
      >
        <van-row>
          <van-col span="7">
            <div class="avatar">
              <img
                :src="
                  'http://ymshosss.oss-cn-shanghai.aliyuncs.com/yq5tAphpDL25Yp1571451037191019.jpg'
                "
              />
            </div>
          </van-col>
          <van-col span="17">
            <van-row>
              <van-col span="14">
                <p class="fs-l">中医药方线下宣传活动</p>
              </van-col>
            </van-row>
            <van-row>
              <van-col span="14">
                <p>南宁 民生广场</p>
              </van-col>
              <van-col span="10" class="p-r-xl text-right fs-xxs"
                ><van-tag plain type="primary">参加</van-tag></van-col
              >
            </van-row>
            <van-row class="op8">
              <van-col span="12">
                <div>
                  <span>3天后开始</span>
                  <svg slot="icon" class="icon tool-icon" aria-hidden="true">
                    <use xlink:href="#icon-location"></use>
                  </svg>
                  <span>0.5km</span>
                </div>
              </van-col>
              <van-col span="12" class="p-r-xl text-right fs-xxs">
                <span>已参加人数 34人 </span>
              </van-col>
            </van-row>
          </van-col>
        </van-row>
      </div>
    </div>
    <copyright />
  </div>
</template>

<script>
export default {
  name: "Index"
};
</script>
<style lang="scss" scoped>
.index-wrap {
  padding-top: 46px;
  .list-wrap {
    .avatar {
      height: 6.5385 * $size;
      width: 6.5385 * $size;
      img {
        height: 100%;
        widows: 100%;
        border-radius: 0.3077 * $size;
      }
    }
  }
}
</style>
